<template>
  <div class="container_box_icon">
    <div class="huan_hotel" @click="showDetail">
      <img :src="huanhotel" />
      <scDialog
        :showDialog="keyPlace.keyPlaceDialog"
        :keyPlace="keyPlace"
        @closeKeyPlace="closeKeyPlace"
      ></scDialog>
    </div>
    <div class="zoom_hotel_car" @click="showDetailZhc">
      <img :src="zoomhotelcar" />
      <scDialog
        :showDialog="keyPlaceZhc.keyPlaceDialog"
        :keyPlace="keyPlaceZhc"
        @closeKeyPlace="closeKeyPlaceZhc"
      ></scDialog>
    </div>
    <div class="zoom_hotel_lou" @click="showDetailZhl">
      <img :src="zoomhotelou" />
      <detailDialog
        :showDialog="keyPlaceZhl.keyPlaceDialog"
        :keyPlace="keyPlaceZhl"
        @closeKeyPlace="closeKeyPlaceZhl"
      ></detailDialog>
    </div>
    <div class="zoom_stop_car" @click="showDetailZsl">
      <img :src="zoomstopcar" />
      <scDialog
        :showDialog="keyPlaceZsl.keyPlaceDialog"
        :keyPlace="keyPlaceZsl"
        @closeKeyPlace="closeKeyPlaceZsl"
      ></scDialog>
    </div>
    <div class="huan_stop_car" @click="showDetailHsc">
      <img :src="huanstopcar" />
      <scDialog
        :showDialog="keyPlaceHsc.keyPlaceDialog"
        :keyPlace="keyPlaceHsc"
        @closeKeyPlace="closeKeyPlaceHsc"
      ></scDialog>
    </div>
    <div class="rui_huan_stop_lou" @click="showDetailRhsl">
      <img :src="ruihuanstoplou" />
      <detailDialog
        :showDialog="keyPlaceRhsl.keyPlaceDialog"
        :keyPlace="keyPlaceRhsl"
        @closeKeyPlace="closeKeyPlaceRhsl"
      ></detailDialog>
    </div>
    <div class="rui_huan_stop_car" @click="showDetailRhsc">
      <img :src="ruihuanstopcar" />
      <scDialog
        :showDialog="keyPlaceRhsc.keyPlaceDialog"
        :keyPlace="keyPlaceRhsc"
        @closeKeyPlace="closeKeyPlaceRhsc"
      ></scDialog>
    </div>
    <div class="xishui_car" @click="showDetailXs">
      <img :src="xishuicar" />
      <scDialog
        :showDialog="keyPlaceXs.keyPlaceDialog"
        :keyPlace="keyPlaceXs"
        @closeKeyPlace="closeKeyPlaceXs"
      ></scDialog>
    </div>
    <div class="guzhen_car" @click="showDetailGc">
      <img :src="guzhencar" />
      <scDialog
        :showDialog="keyPlaceGc.keyPlaceDialog"
        :keyPlace="keyPlaceGc"
        @closeKeyPlace="closeKeyPlaceGc"
      ></scDialog>
    </div>
    <div class="ruifeng_guzhen_lou" @click="showDetailRgl">
      <img :src="ruifengguzhenlou" />
      <detailDialog
        :showDialog="keyPlaceRgl.keyPlaceDialog"
        :keyPlace="keyPlaceRgl"
        @closeKeyPlace="closeKeyPlaceRgl"
      ></detailDialog>
    </div>
    <div class="ruifeng_guzhen_car" @click="showDetailRgc">
      <img :src="ruifengguzhencar" />
      <scDialog
        :showDialog="keyPlaceRgc.keyPlaceDialog"
        :keyPlace="keyPlaceRgc"
        @closeKeyPlace="closeKeyPlaceRgc"
      ></scDialog>
    </div>
    <div class="lz_guzhen_lou" @click="showDetailLgl">
      <img :src="lzguzhenlou" />
      <detailDialog
        :showDialog="keyPlaceLgl.keyPlaceDialog"
        :keyPlace="keyPlaceLgl"
        @closeKeyPlace="closeKeyPlaceLgl"
      ></detailDialog>
    </div>
    <div class="lz_guzhen_car" @click="showDetailLgc">
      <img :src="lzguzhencar" />
      <scDialog
        :showDialog="keyPlaceLgc.keyPlaceDialog"
        :keyPlace="keyPlaceLgc"
        @closeKeyPlace="closeKeyPlaceLgc"
      ></scDialog>
    </div>
    <div class="ys_hotel_lou" @click="showDetailYhl">
      <img :src="yshotelou" />
      <detailDialog
        :showDialog="keyPlaceYhl.keyPlaceDialog"
        :keyPlace="keyPlaceYhl"
        @closeKeyPlace="closeKeyPlaceYhl"
      ></detailDialog>
    </div>
    <div class="ys_hotel_car" @click="showDetailYhc">
      <img :src="yshotelcar" />
      <scDialog
        :showDialog="keyPlaceYhc.keyPlaceDialog"
        :keyPlace="keyPlaceYhc"
        @closeKeyPlace="closeKeyPlaceYhc"
      ></scDialog>
    </div>
    <div class="zs_hotel_lou" @click="showDetailZshl">
      <img :src="zshotelou" />
      <detailDialog
        :showDialog="keyPlaceZshl.keyPlaceDialog"
        :keyPlace="keyPlaceZshl"
        @closeKeyPlace="closeKeyPlaceZshl"
      ></detailDialog>
    </div>
    <div class="zs_hotel_car" @click="showDetailZshc">
      <img :src="zshotelcar" />
      <scDialog
        :showDialog="keyPlaceZshc.keyPlaceDialog"
        :keyPlace="keyPlaceZshc"
        @closeKeyPlace="closeKeyPlaceZshc"
      ></scDialog>
    </div>
    <div class="ys_stop_car" @click="showDetailYsc">
      <img :src="ysstopcar" />
      <scDialog
        :showDialog="keyPlaceYsc.keyPlaceDialog"
        :keyPlace="keyPlaceYsc"
        @closeKeyPlace="closeKeyPlaceYsc"
      ></scDialog>
    </div>
    <div class="zs_stop_car" @click="showDetailZsc">
      <img :src="zsstopcar" />
      <scDialog
        :showDialog="keyPlaceZsc.keyPlaceDialog"
        :keyPlace="keyPlaceZsc"
        @closeKeyPlace="closeKeyPlaceZsc"
      ></scDialog>
    </div>
  </div>
</template>

<script>
import detailDialog from './dialog/detailDialog.vue'
import scDialog from './dialog/scDialog.vue'
import { CONST_NAME } from './constname'

export default {
  components: {
    detailDialog,
    scDialog,
  },
  props: {
    hotelData: {
      type: Array,
      default: () => {
        return []
      },
    },
    parkData: {
      type: Array,
      default: () => {
        return []
      },
    },
    scenicSpotData: {
      // type: Object,
      // default: () => {
      //     return {}
      // }
    },
  },
  created() {},
  data() {
    return {
      huanhotel: '',
      zoomhotelcar: '',
      zoomhotelou: '',
      zoomstopcar: '',
      huanstopcar: '',
      ruihuanstoplou: '',
      ruihuanstopcar: '',
      xishuicar: '',
      guzhencar: '',
      ruifengguzhenlou: '',
      ruifengguzhencar: '',
      lzguzhenlou: '',
      lzguzhencar: '',
      yshotelou: '',
      yshotelcar: '',
      zshotelou: '',
      zshotelcar: '',
      ysstopcar: '',
      zsstopcar: '',
      keyPlace: {
        keyPlaceDialog: false,
        keyPlaceData: {
          name: '',
          tolenum: '-',
          syunum: '-',
          rzrsnum: '-',
          fznum: '-',
        },
      },
      keyPlaceZhc: {
        keyPlaceDialog: false,
        keyPlaceData: {
          name: '',
          tolenum: '-',
          syunum: '-',
          rzrsnum: '-',
          fznum: '-',
        },
      },
      keyPlaceZhl: {
        keyPlaceDialog: false,
        keyPlaceData: {
          name: '',
          tolenum: '-',
          syunum: '-',
          rzrsnum: '-',
          fznum: '-',
        },
      },
      keyPlaceZsl: {
        keyPlaceDialog: false,
        keyPlaceData: {
          name: '',
          tolenum: '-',
          syunum: '-',
          rzrsnum: '-',
          fznum: '-',
        },
      },
      keyPlaceHsc: {
        keyPlaceDialog: false,
        keyPlaceData: {
          name: '',
          tolenum: '-',
          syunum: '-',
          rzrsnum: '-',
          fznum: '-',
        },
      },
      keyPlaceRhsl: {
        keyPlaceDialog: false,
        keyPlaceData: {
          name: '',
          tolenum: '-',
          syunum: '-',
          rzrsnum: '-',
          fznum: '-',
        },
      },
      keyPlaceRhsc: {
        keyPlaceDialog: false,
        keyPlaceData: {
          name: '',
          tolenum: '-',
          syunum: '-',
          rzrsnum: '-',
          fznum: '-',
        },
      },
      keyPlaceXs: {
        keyPlaceDialog: false,
        keyPlaceData: {
          name: '',
          tolenum: '-',
          syunum: '-',
          rzrsnum: '-',
          fznum: '-',
        },
      },
      keyPlaceGc: {
        keyPlaceDialog: false,
        keyPlaceData: {
          name: '',
          tolenum: '-',
          syunum: '-',
          rzrsnum: '-',
          fznum: '-',
        },
      },
      keyPlaceRgl: {
        keyPlaceDialog: false,
        keyPlaceData: {
          name: '',
          tolenum: '-',
          syunum: '-',
          rzrsnum: '-',
          fznum: '-',
        },
      },
      keyPlaceRgc: {
        keyPlaceDialog: false,
        keyPlaceData: {
          name: '',
          tolenum: '-',
          syunum: '-',
          rzrsnum: '-',
          fznum: '-',
        },
      },
      keyPlaceLgl: {
        keyPlaceDialog: false,
        keyPlaceData: {
          name: '',
          tolenum: '-',
          syunum: '-',
          rzrsnum: '-',
          fznum: '-',
        },
      },
      keyPlaceLgc: {
        keyPlaceDialog: false,
        keyPlaceData: {
          name: '',
          tolenum: '-',
          syunum: '-',
          rzrsnum: '-',
          fznum: '-',
        },
      },
      keyPlaceYhl: {
        keyPlaceDialog: false,
        keyPlaceData: {
          name: '',
          tolenum: '-',
          syunum: '-',
          rzrsnum: '-',
          fznum: '-',
        },
      },
      keyPlaceYhc: {
        keyPlaceDialog: false,
        keyPlaceData: {
          name: '',
          tolenum: '-',
          syunum: '-',
          rzrsnum: '-',
          fznum: '-',
        },
      },
      keyPlaceZshl: {
        keyPlaceDialog: false,
        keyPlaceData: {
          name: '',
          tolenum: '-',
          syunum: '-',
          rzrsnum: '-',
          fznum: '-',
        },
      },
      keyPlaceZshc: {
        keyPlaceDialog: false,
        keyPlaceData: {
          name: '',
          tolenum: '-',
          syunum: '-',
          rzrsnum: '-',
          fznum: '-',
        },
      },
      keyPlaceYsc: {
        keyPlaceDialog: false,
        keyPlaceData: {
          name: '',
          tolenum: '-',
          syunum: '-',
          rzrsnum: '-',
          fznum: '-',
        },
      },
      keyPlaceZsc: {
        keyPlaceDialog: false,
        keyPlaceData: {
          name: '',
          tolenum: '-',
          syunum: '-',
          rzrsnum: '-',
          fznum: '-',
        },
      },
    }
  },
  mounted() {
    this.huanhotel = this.getCarPng(false, true, 1)
    this.zoomhotelcar = this.getCarPng(true, true, 3)
    this.zoomhotelou = this.getCarPng(true, false, 1)
    this.zoomstopcar = this.getCarPng(true, true, 1)
    this.huanstopcar = this.getCarPng(false, true, 1)
    this.ruihuanstoplou = this.getCarPng(false, false, 1)
    this.ruihuanstopcar = this.getCarPng(false, true, 1)
    this.xishuicar = this.getCarPng(true, true, 1)
    this.guzhencar = this.getCarPng(true, true, 1)
    this.ruifengguzhenlou = this.getCarPng(false, false, 1)
    this.ruifengguzhencar = this.getCarPng(false, true, 1)
    this.lzguzhenlou = this.getCarPng(false, false, 1)
    this.lzguzhencar = this.getCarPng(false, true, 1)
    this.yshotelou = this.getCarPng(false, false, 2)
    this.yshotelcar = this.getCarPng(false, true, 1)
    this.zshotelou = this.getCarPng(false, false, 3)
    this.zshotelcar = this.getCarPng(false, true, 1)
    this.ysstopcar = this.getCarPng(true, true, 1)
    this.zsstopcar = this.getCarPng(true, true, 1)
  },
  destroyed() {},
  methods: {
    getCarPng(isup, iscar, type) {
      let iconstr = '/static/icon/'
      if (isup) {
        iconstr = iconstr + 'up/'
      } else {
        iconstr = iconstr + 'down/'
      }
      return this.getCarType(iconstr, iscar, type)
    },
    getCarType(iconstr, iscar, type) {
      if (iscar) {
        if (type === 1 || type === '1') {
          iconstr += 'carlv.png'
        } else if (type === 2 || type === '2') {
          iconstr += 'carhu.png'
        } else if (type === 3 || type === '3') {
          iconstr += 'carred.png'
        }
      } else {
        if (type === 1 || type === '1') {
          iconstr += 'loulan.png'
        } else if (type === 2 || type === '2') {
          iconstr += 'louhu.png'
        } else if (type === 3 || type === '3') {
          iconstr += 'loured.png'
        }
      }
      return iconstr
    },
    setWarnStatus(num) {
      if (num <= 50) {
        return 1
      } else if (num > 50 && num <= 70) {
        return 2
      } else {
        return 3
      }
    },
    getItemData(arr, name, value) {
      for (var i = 0; i < arr.length; i++) {
        if (arr[i][name] === value) {
          return arr[i]
        }
      }
    },
    updateCarIconPng(data) {
      let item = this.getItemData(
        data,
        'parkingname',
        CONST_NAME.ANIMINE_PART_HOTEL_STOP_REST
      )
      this.zoomhotelcar = this.getCarPng(
        true,
        true,
        this.setWarnStatus(item.fuzailv)
      )

      item = []
      item = this.getItemData(
        data,
        'parkingname',
        CONST_NAME.ANIMINE_PART_STOP_REST
      )
      this.zoomstopcar = this.getCarPng(
        true,
        true,
        this.setWarnStatus(item.fuzailv)
      )

      item = []
      item = this.getItemData(
        data,
        'parkingname',
        CONST_NAME.XISHUI_CENTER_REST
      )
      this.xishuicar = this.getCarPng(
        true,
        true,
        this.setWarnStatus(item.fuzailv)
      )

      item = []
      item = this.getItemData(data, 'parkingname', CONST_NAME.GUZHEN_REST)
      this.guzhencar = this.getCarPng(
        true,
        true,
        this.setWarnStatus(item.fuzailv)
      )

      item = []
      item = this.getItemData(
        data,
        'parkingname',
        CONST_NAME.ZUANSHI_HOTEL_REST
      )
      this.zshotelcar = this.getCarPng(
        false,
        true,
        this.setWarnStatus(item.fuzailv)
      )

      item = []
      item = this.getItemData(data, 'parkingname', CONST_NAME.YASHI_STOP_REST)
      this.ysstopcar = this.getCarPng(
        true,
        true,
        this.setWarnStatus(item.fuzailv)
      )

      item = []
      item = this.getItemData(data, 'parkingname', CONST_NAME.ZUANSHI_STOP_REST)
      this.zsstopcar = this.getCarPng(
        true,
        true,
        this.setWarnStatus(item.fuzailv)
      )
    },
    updateHotelIconPng(data) {
      let item = this.getItemData(
        data,
        'hotel',
        CONST_NAME.ANIMINE_PART_HOTEL_REST
      )
      this.zoomhotelou = this.getCarPng(
        true,
        false,
        this.setWarnStatus(item.occupiedtonightpre)
      )

      item = []
      item = this.getItemData(data, 'hotel', CONST_NAME.YASHI_HOTEL_REST)
      this.yshotelou = this.getCarPng(
        false,
        false,
        this.setWarnStatus(item.occupiedtonightpre)
      )

      item = []
      item = this.getItemData(data, 'hotel', CONST_NAME.ZUANSHI_HOTEL)
      this.zshotelou = this.getCarPng(
        false,
        false,
        this.setWarnStatus(item.occupiedtonightpre)
      )
    },
    showDetail() {
      this.keyPlace.keyPlaceData.name = CONST_NAME.HUANLE_STOP_CAR
      this.keyPlace.keyPlaceDialog = !this.keyPlace.keyPlaceDialog
      if (this.keyPlace.keyPlaceDialog) {
        this.tongShow(3)
      }
    },
    closeKeyPlace(val) {
      this.keyPlace.keyPlaceDialog = val
    },
    showDetailZhc() {
      let item = this.getItemData(
        this.parkData,
        'parkingname',
        CONST_NAME.ANIMINE_PART_HOTEL_STOP_REST
      )
      this.keyPlaceZhc.keyPlaceData.name = CONST_NAME.ANIMINE_PART_HOTEL
      this.keyPlaceZhc.keyPlaceData.tolenum = item.zcw
      this.keyPlaceZhc.keyPlaceData.syunum = item.sycw
      this.keyPlaceZhc.keyPlaceData.fznum = item.fuzailv
      this.keyPlaceZhc.keyPlaceDialog = !this.keyPlaceZhc.keyPlaceDialog
      if (this.keyPlaceZhc.keyPlaceDialog) {
        this.tongShow(4)
      }
    },
    closeKeyPlaceZhc(val) {
      this.keyPlaceZhc.keyPlaceDialog = val
    },
    showDetailZhl() {
      let item = this.getItemData(
        this.hotelData,
        'hotel',
        CONST_NAME.ANIMINE_PART_HOTEL_REST
      )
      this.keyPlaceZhl.keyPlaceData.name = CONST_NAME.ANIMINE_PART_HOTEL
      this.keyPlaceZhl.keyPlaceData.tolenum = item.sumroom
      this.keyPlaceZhl.keyPlaceData.syunum = item.restroom
      this.keyPlaceZhl.keyPlaceData.rzrsnum = item.occupiedtonightpersons
      this.keyPlaceZhl.keyPlaceData.fznum = item.occupiedtonightpre
      this.keyPlaceZhl.keyPlaceDialog = !this.keyPlaceZhl.keyPlaceDialog
      if (this.keyPlaceZhl.keyPlaceDialog) {
        this.tongShow(5)
      }
    },
    closeKeyPlaceZhl(val) {
      this.keyPlaceZhl.keyPlaceDialog = val
    },
    showDetailZsl() {
      let item = this.getItemData(
        this.parkData,
        'parkingname',
        CONST_NAME.ANIMINE_PART_STOP_REST
      )
      this.keyPlaceZsl.keyPlaceData.name = CONST_NAME.ANIMINE_PART_HOTEL
      this.keyPlaceZsl.keyPlaceData.tolenum = item.zcw
      this.keyPlaceZsl.keyPlaceData.syunum = item.sycw
      this.keyPlaceZsl.keyPlaceData.fznum = item.fuzailv
      this.keyPlaceZsl.keyPlaceDialog = !this.keyPlaceZsl.keyPlaceDialog
      if (this.keyPlaceZsl.keyPlaceDialog) {
        this.tongShow(6)
      }
    },
    closeKeyPlaceZsl(val) {
      this.keyPlaceZsl.keyPlaceDialog = val
    },
    showDetailHsc() {
      this.keyPlaceHsc.keyPlaceData.name = CONST_NAME.HUANLE_CENTER_STOP
      this.keyPlaceHsc.keyPlaceDialog = !this.keyPlaceHsc.keyPlaceDialog
      if (this.keyPlaceHsc.keyPlaceDialog) {
        this.tongShow(7)
      }
    },
    closeKeyPlaceHsc(val) {
      this.keyPlaceHsc.keyPlaceDialog = val
    },
    showDetailRhsl() {
      this.keyPlaceRhsl.keyPlaceData.name = CONST_NAME.RUIFENG_HUANLE_HOTEL
      this.keyPlaceRhsl.keyPlaceDialog = !this.keyPlaceRhsl.keyPlaceDialog
      if (this.keyPlaceRhsl.keyPlaceDialog) {
        this.tongShow(8)
      }
    },
    closeKeyPlaceRhsl(val) {
      this.keyPlaceRhsl.keyPlaceDialog = val
    },
    showDetailRhsc() {
      this.keyPlaceRhsc.keyPlaceData.name = CONST_NAME.RUIFENG_HUANLE_HOTEL
      this.keyPlaceRhsc.keyPlaceDialog = !this.keyPlaceRhsc.keyPlaceDialog
      if (this.keyPlaceRhsc.keyPlaceDialog) {
        this.tongShow(9)
      }
    },
    closeKeyPlaceRhsc(val) {
      this.keyPlaceRhsc.keyPlaceDialog = val
    },
    showDetailXs() {
      let item = this.getItemData(
        this.parkData,
        'parkingname',
        CONST_NAME.XISHUI_CENTER_REST
      )
      this.keyPlaceXs.keyPlaceData.name = CONST_NAME.XISHUI_CENTER
      this.keyPlaceXs.keyPlaceData.tolenum = item.zcw
      this.keyPlaceXs.keyPlaceData.syunum = item.sycw
      this.keyPlaceXs.keyPlaceData.fznum = item.fuzailv
      this.keyPlaceXs.keyPlaceDialog = !this.keyPlaceXs.keyPlaceDialog
      if (this.keyPlaceXs.keyPlaceDialog) {
        this.tongShow(21)
      }
    },
    closeKeyPlaceXs(val) {
      this.keyPlaceXs.keyPlaceDialog = val
    },
    showDetailGc() {
      let item = this.getItemData(
        this.parkData,
        'parkingname',
        CONST_NAME.GUZHEN_REST
      )
      this.keyPlaceGc.keyPlaceData.name = CONST_NAME.GUZHE
      this.keyPlaceGc.keyPlaceData.tolenum = item.zcw
      this.keyPlaceGc.keyPlaceData.syunum = item.sycw
      this.keyPlaceGc.keyPlaceData.fznum = item.fuzailv
      this.keyPlaceGc.keyPlaceDialog = !this.keyPlaceGc.keyPlaceDialog
      if (this.keyPlaceGc.keyPlaceDialog) {
        this.tongShow(10)
      }
    },
    closeKeyPlaceGc(val) {
      this.keyPlaceGc.keyPlaceDialog = val
    },
    showDetailRgl() {
      this.keyPlaceRgl.keyPlaceData.name = CONST_NAME.RUIFENG_GUZHEN_HOTEL
      this.keyPlaceRgl.keyPlaceDialog = !this.keyPlaceRgl.keyPlaceDialog
      if (this.keyPlaceRgl.keyPlaceDialog) {
        this.tongShow(11)
      }
    },
    closeKeyPlaceRgl(val) {
      this.keyPlaceRgl.keyPlaceDialog = val
    },
    showDetailRgc() {
      this.keyPlaceRgc.keyPlaceData.name = CONST_NAME.RUIFENG_GUZHEN_HOTEL
      this.keyPlaceRgc.keyPlaceDialog = !this.keyPlaceRgc.keyPlaceDialog
      if (this.keyPlaceRgc.keyPlaceDialog) {
        this.tongShow(12)
      }
    },
    closeKeyPlaceRgc(val) {
      this.keyPlaceRgc.keyPlaceDialog = val
    },
    showDetailLgl() {
      this.keyPlaceLgl.keyPlaceData.name = CONST_NAME.LONGZHIMENG_GUZHEN_HOTEL
      this.keyPlaceLgl.keyPlaceDialog = !this.keyPlaceLgl.keyPlaceDialog
      if (this.keyPlaceLgl.keyPlaceDialog) {
        this.tongShow(13)
      }
    },
    closeKeyPlaceLgl(val) {
      this.keyPlaceLgl.keyPlaceDialog = val
    },
    showDetailLgc() {
      this.keyPlaceLgc.keyPlaceData.name = CONST_NAME.LONGZHIMENG_GUZHEN_HOTEL
      this.keyPlaceLgc.keyPlaceDialog = !this.keyPlaceLgc.keyPlaceDialog
      if (this.keyPlaceLgc.keyPlaceDialog) {
        this.tongShow(14)
      }
    },
    closeKeyPlaceLgc(val) {
      this.keyPlaceLgc.keyPlaceDialog = val
    },
    showDetailYhl() {
      let item = this.getItemData(
        this.hotelData,
        'hotel',
        CONST_NAME.YASHI_HOTEL_REST
      )
      this.keyPlaceYhl.keyPlaceData.name = CONST_NAME.YASHI_HOTEL
      this.keyPlaceYhl.keyPlaceData.tolenum = item.sumroom
      this.keyPlaceYhl.keyPlaceData.syunum = item.restroom
      this.keyPlaceYhl.keyPlaceData.rzrsnum = item.occupiedtonightpersons
      this.keyPlaceYhl.keyPlaceData.fznum = item.occupiedtonightpre
      this.keyPlaceYhl.keyPlaceDialog = !this.keyPlaceYhl.keyPlaceDialog
      if (this.keyPlaceYhl.keyPlaceDialog) {
        this.tongShow(15)
      }
    },
    closeKeyPlaceYhl(val) {
      this.keyPlaceYhl.keyPlaceDialog = val
    },
    showDetailYhc() {
      this.keyPlaceYhc.keyPlaceData.name = CONST_NAME.YASHI_HOTEL
      this.keyPlaceYhc.keyPlaceDialog = !this.keyPlaceYhc.keyPlaceDialog
      if (this.keyPlaceYhc.keyPlaceDialog) {
        this.tongShow(16)
      }
    },
    closeKeyPlaceYhc(val) {
      this.keyPlaceYhc.keyPlaceDialog = val
    },
    showDetailZshl() {
      let item = this.getItemData(
        this.hotelData,
        'hotel',
        CONST_NAME.ZUANSHI_HOTEL
      )
      this.keyPlaceZshl.keyPlaceData.name = CONST_NAME.ZUANSHI_HOTEL
      this.keyPlaceZshl.keyPlaceData.tolenum = item.sumroom
      this.keyPlaceZshl.keyPlaceData.syunum = item.restroom
      this.keyPlaceZshl.keyPlaceData.rzrsnum = item.occupiedtonightpersons
      this.keyPlaceZshl.keyPlaceData.fznum = item.occupiedtonightpre
      this.keyPlaceZshl.keyPlaceDialog = !this.keyPlaceZshl.keyPlaceDialog
      if (this.keyPlaceZshl.keyPlaceDialog) {
        this.tongShow(17)
      }
    },
    closeKeyPlaceZshl(val) {
      this.keyPlaceZshl.keyPlaceDialog = val
    },
    showDetailZshc() {
      let item = this.getItemData(
        this.parkData,
        'parkingname',
        CONST_NAME.ZUANSHI_HOTEL_REST
      )
      this.keyPlaceZshc.keyPlaceData.name = CONST_NAME.ZUANSHI_HOTEL
      this.keyPlaceZshc.keyPlaceData.tolenum = item.zcw
      this.keyPlaceZshc.keyPlaceData.syunum = item.sycw
      this.keyPlaceZshc.keyPlaceData.fznum = item.fuzailv
      this.keyPlaceZshc.keyPlaceDialog = !this.keyPlaceZshc.keyPlaceDialog
      if (this.keyPlaceZshc.keyPlaceDialog) {
        this.tongShow(18)
      }
    },
    closeKeyPlaceZshc(val) {
      this.keyPlaceZshc.keyPlaceDialog = val
    },
    showDetailYsc() {
      let item = this.getItemData(
        this.parkData,
        'parkingname',
        CONST_NAME.YASHI_STOP_REST
      )
      this.keyPlaceYsc.keyPlaceData.name = CONST_NAME.YASHI_STOP
      this.keyPlaceYsc.keyPlaceData.tolenum = item.zcw
      this.keyPlaceYsc.keyPlaceData.syunum = item.sycw
      this.keyPlaceYsc.keyPlaceData.fznum = item.fuzailv
      this.keyPlaceYsc.keyPlaceDialog = !this.keyPlaceYsc.keyPlaceDialog
      if (this.keyPlaceYsc.keyPlaceDialog) {
        this.tongShow(19)
      }
    },
    closeKeyPlaceYsc(val) {
      this.keyPlaceYsc.keyPlaceDialog = val
    },
    showDetailZsc() {
      let item = this.getItemData(
        this.parkData,
        'parkingname',
        CONST_NAME.ZUANSHI_STOP_REST
      )
      this.keyPlaceZsc.keyPlaceData.name = CONST_NAME.ZUANSHI_STOP_REST
      this.keyPlaceZsc.keyPlaceData.tolenum = item.zcw
      this.keyPlaceZsc.keyPlaceData.syunum = item.sycw
      this.keyPlaceZsc.keyPlaceData.fznum = item.fuzailv
      this.keyPlaceZsc.keyPlaceDialog = !this.keyPlaceZsc.keyPlaceDialog
      if (this.keyPlaceZsc.keyPlaceDialog) {
        this.tongShow(20)
      }
    },
    closeKeyPlaceZsc(val) {
      this.keyPlaceZsc.keyPlaceDialog = val
    },
    closeAll() {
      this.closeKeyPlace(false)
      this.closeKeyPlaceZhc(false)
      this.closeKeyPlaceZhl(false)
      this.closeKeyPlaceZsl(false)
      this.closeKeyPlaceHsc(false)
      this.closeKeyPlaceRhsl(false)
      this.closeKeyPlaceRhsc(false)
      this.closeKeyPlaceXs(false)
      this.closeKeyPlaceGc(false)
      this.closeKeyPlaceRgl(false)
      this.closeKeyPlaceRgc(false)
      this.closeKeyPlaceLgl(false)
      this.closeKeyPlaceLgc(false)
      this.closeKeyPlaceYhl(false)
      this.closeKeyPlaceYhc(false)
      this.closeKeyPlaceZshl(false)
      this.closeKeyPlaceZshc(false)
      this.closeKeyPlaceYsc(false)
      this.closeKeyPlaceZsc(false)
    },
    tongShow(num) {
      this.closeAll()
      switch (num) {
        case 3:
          this.closeKeyPlace(true)
          break
        case 4:
          this.closeKeyPlaceZhc(true)
          break
        case 5:
          this.closeKeyPlaceZhl(true)
          break
        case 6:
          this.closeKeyPlaceZsl(true)
          break
        case 7:
          this.closeKeyPlaceHsc(true)
          break
        case 8:
          this.closeKeyPlaceRhsl(true)
          break
        case 9:
          this.closeKeyPlaceRhsc(true)
          break
        case 10:
          this.closeKeyPlaceGc(true)
          break
        case 11:
          this.closeKeyPlaceRgl(true)
          break
        case 12:
          this.closeKeyPlaceRgc(true)
          break
        case 13:
          this.closeKeyPlaceLgl(true)
          break
        case 14:
          this.closeKeyPlaceLgc(true)
          break
        case 15:
          this.closeKeyPlaceYhl(true)
          break
        case 16:
          this.closeKeyPlaceYhc(true)
          break
        case 17:
          this.closeKeyPlaceZshl(true)
          break
        case 18:
          this.closeKeyPlaceZshc(true)
          break
        case 19:
          this.closeKeyPlaceYsc(true)
          break
        case 20:
          this.closeKeyPlaceZsc(true)
          break
        case 21:
          this.closeKeyPlaceXs(true)
          break
      }
    },
  },
}
</script>

<style lang="less" scoped>
.container_box_icon {
  .huan_hotel {
    top: 372px;
    left: 545px;
    width: 45px;
    height: 59px;
    position: fixed;
  }
  .zoom_hotel_car {
    top: 421px;
    left: 404px;
    width: 45px;
    height: 59px;
    position: fixed;
  }
  .zoom_hotel_lou {
    top: 421px;
    left: 343px;

    width: 45px;
    height: 59px;
    position: fixed;
  }
  .zoom_stop_car {
    top: 527px;
    left: 230px;
    width: 45px;
    height: 59px;
    position: fixed;
    z-index: 3;
  }
  .huan_stop_car {
    bottom: 257px;
    left: 203px;
    width: 45px;
    height: 59px;
    position: fixed;
  }
  .rui_huan_stop_lou {
    bottom: 186px;
    left: 326px;
    width: 45px;
    height: 59px;
    position: fixed;
  }
  .rui_huan_stop_car {
    bottom: 186px;
    left: 397px;
    width: 45px;
    height: 59px;
    position: fixed;
  }
  .xishui_car {
    top: 660px;
    left: 610px;
    width: 45px;
    height: 59px;
    position: fixed;
  }
  .guzhen_car {
    top: 575px;
    left: 1088px;
    width: 45px;
    height: 59px;
    position: fixed;
  }
  .ruifeng_guzhen_lou {
    bottom: 54px;
    left: 927px;
    width: 45px;
    height: 59px;
    position: fixed;
  }
  .ruifeng_guzhen_car {
    bottom: 54px;
    left: 999px;
    width: 45px;
    height: 59px;
    position: fixed;
  }
  .lz_guzhen_lou {
    bottom: 54px;
    left: 1142px;
    width: 45px;
    height: 59px;
    position: fixed;
  }
  .lz_guzhen_car {
    bottom: 54px;
    left: 1214px;
    width: 45px;
    height: 59px;
    position: fixed;
  }
  .ys_hotel_lou {
    bottom: 95px;
    right: 510px;
    width: 45px;
    height: 59px;
    position: fixed;
  }
  .ys_hotel_car {
    bottom: 95px;
    right: 425px;
    width: 45px;
    height: 59px;
    position: fixed;
  }
  .zs_hotel_lou {
    bottom: 95px;
    right: 314px;
    width: 45px;
    height: 59px;
    position: fixed;
  }
  .zs_hotel_car {
    bottom: 95px;
    right: 233px;
    width: 45px;
    height: 59px;
    position: fixed;
  }
  .ys_stop_car {
    bottom: 358px;
    right: 455px;
    width: 45px;
    height: 59px;
    position: fixed;
  }
  .zs_stop_car {
    bottom: 358px;
    right: 286px;
    width: 45px;
    height: 59px;
    position: fixed;
  }
}
</style>
